<script lang="ts" setup>
import { useAdminUserStore } from "../store/adminUser"

const { common, addDialog } = useAdminUserStore()
</script>

<template>
  <t-dialog
    v-model:visible="addDialog.visible"
    :footer="false"
    :onClose="common.clear"
    destroyOnClose
    header="添加授权"
  >
    <t-row style="padding:10px">
      <t-form :data="common.formData" label-width="80px" label-align="right" style="width: 100%"
              @submit="addDialog.add"
              :rules="common.rules"
      >

        <t-form-item label="用户ID"
                     name="user_id">
          <t-input v-model="common.formData.user_id" placeholder="请输入用户ID" />
        </t-form-item>

        <t-form-item label="应用名称"
                     name="app_name">
          <t-select
            v-model="addDialog.appNameValue"
            :options="addDialog.nameLists"
            placeholder="请选择应用"
            value-type="object"
            @change="addDialog.appNameChange"
          />
        </t-form-item>

        <t-form-item label="应用ID"
                     name="app_id">
          <t-input v-model="common.formData.app_id" placeholder="应用ID（自动填入）" readonly />
        </t-form-item>

        <t-form-item label="验证方式"
                     name="type">
          <t-select v-model="common.formData.type" :options="common.typeOptions" />
        </t-form-item>

        <t-form-item label="授权主体"
                     name="body">
          <t-input placeholder="请输入授权域名或IP" v-model="common.formData.body"/>
        </t-form-item>

        <t-form-item label="授权状态"
                     name="status">
          <t-switch v-model="common.formData.status" :custom-value="[1,0]" />
        </t-form-item>

        <t-space style="display:flex;justify-content: space-between">
          <t-form-item label="永久授权"
                       name="isForever">
            <t-switch v-model="common.isForever" />
          </t-form-item>

          <t-form-item v-if="!common.isForever"
                       label="过期时间"
                       name="over_date">
            <t-date-picker v-model="common.formData.over_date" placeholder="请选择过期时间" />
          </t-form-item>
        </t-space>

        <t-divider />

        <t-form-item style="display:flex;justify-content: right">
          <t-space>
            <t-button variant="outline" @click="addDialog.visible = false">取消</t-button>
            <t-button theme="primary" type="submit" :loading="addDialog.loading">确定</t-button>
          </t-space>
        </t-form-item>

      </t-form>
    </t-row>
  </t-dialog>
</template>

<style lang="less" scoped>

</style>
